```jsx
import * as checkbox from "@zag-js/checkbox"
import { normalizeProps, useMachine } from "@zag-js/solid"
import { createMemo, createUniqueId } from "solid-js"

function Checkbox() {
  const service = useMachine(checkbox.machine, { id: createUniqueId() })

  const api = createMemo(() => checkbox.connect(service, normalizeProps))

  return (
    <label {...api().getRootProps()}>
      <span {...api().getLabelProps()}>
        Input is {api().checked ? "checked" : "unchecked"}
      </span>
      <div {...api().getControlProps()} />
      <input {...api().getHiddenInputProps()} />
    </label>
  )
}
```
